<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>签到管理</title>
    <link href="../../../css/mui.min.css" rel="stylesheet" />
    <link href="../../../js/swiper/swiper.css" rel="stylesheet">
    <!--全局css-->
    <link href="../../../css/g.css" rel="stylesheet">
    <link href="../../../js/Calender/Calender.css" rel="stylesheet">
    <!--每个文件对应一个css-->
    <link href="sign.css" rel="stylesheet">
    <script>
        //每个页面必须添加 ，css单位使用rem
        document.documentElement.style.fontSize = window.innerWidth / 7.5 + 'px';
    </script>
</head>
<body>
<header class="mui-bar mui-bar-nav">
    <button class="mui-action-back mui-btn mui-btn-blue mui-btn-link mui-btn-nav mui-pull-left">
        <span class="mui-icon mui-icon-left-nav"></span>
        签到管理
    </button>
</header>
<div class="mui-scroll-wrapper a-top44">
    <div class="mui-scroll">
        <!--日历-->
        <div class="day-title clearfix">
            <span id="day-prev" class="mui-icon mui-icon-back"></span>
            <strong class="day-box"><i id="day-box">16</i>日</strong>
            <p class="year-box content" id="year-box">2017</p>
            <p class="month-box content" id="month-box">05月</p>
            <span id="day-next" class="mui-icon mui-icon-forward"></span>
            <input class="sign-btn" id="sign-btn" type="button" value="补签">
        </div>
        <div class="day">
        </div>
        <!--签到-->
        <p class="list-title">签到8人 , 未签到0人</p>
        <ul class="mui-table-view person-list">
            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;" class="">
                    <span class="mui-media-object mui-pull-left headImg" style="background: url('../../../img/contact/touxiang.png') no-repeat center center;background-size:cover;-webkit-background-size:cover;"></span>
                    <div class="mui-media-body">
                        林岚 <span class="woman"></span>
                        <p class="mui-ellipsis">闽江学院闽江学院闽江学院闽江学院闽江学院闽江学院闽江学院</p>
                    </div>
                    <span class="date">10:34</span>
                </a>
            </li>
            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;" class="">
                    <span class="mui-media-object mui-pull-left headImg" style="background: url('../../../img/contact/touxiang.png') no-repeat center center;background-size:cover;-webkit-background-size:cover;"></span>
                    <div class="mui-media-body">
                        林岚 <span class="woman"></span>
                        <p class="mui-ellipsis">闽江学院闽江学院闽江学院闽江学院闽江学院</p>
                    </div>
                    <span class="date">10:34</span>
                </a>
            </li>
            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;" class="">
                    <span class="mui-media-object mui-pull-left headImg" style="background: url('../../../img/contact/touxiang.png') no-repeat center center;background-size:cover;-webkit-background-size:cover;"></span>
                    <div class="mui-media-body">
                        林岚 <span class="woman"></span>
                        <p class="mui-ellipsis">闽江学院闽江学院闽江学院闽江学院闽江学院</p>
                    </div>
                    <span class="date">10:34</span>
                </a>
            </li>
            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;" class="">
                    <span class="mui-media-object mui-pull-left headImg" style="background: url('../../../img/contact/touxiang.png') no-repeat center center;background-size:cover;-webkit-background-size:cover;"></span>
                    <div class="mui-media-body">
                        林岚 <span class="woman"></span>
                        <p class="mui-ellipsis">闽江学院闽江学院闽江学院闽江学院闽江学院</p>
                    </div>
                    <span class="date">10:34</span>
                </a>
            </li>
            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;" class="">
                    <span class="mui-media-object mui-pull-left headImg" style="background: url('../../../img/contact/touxiang.png') no-repeat center center;background-size:cover;-webkit-background-size:cover;"></span>
                    <div class="mui-media-body">
                        林岚 <span class="woman"></span>
                        <p class="mui-ellipsis">闽江学院闽江学院闽江学院闽江学院闽江学院</p>
                    </div>
                    <span class="date">10:34</span>
                </a>
            </li>
            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;" class="">
                    <span class="mui-media-object mui-pull-left headImg" style="background: url('../../../img/contact/touxiang.png') no-repeat center center;background-size:cover;-webkit-background-size:cover;"></span>
                    <div class="mui-media-body">
                        林岚 <span class="woman"></span>
                        <p class="mui-ellipsis">闽江学院闽江学院闽江学院闽江学院闽江学院</p>
                    </div>
                    <span class="date">10:34</span>
                </a>
            </li>
            <li class="mui-table-view-cell mui-media">
                <a href="javascript:;" class="">
                    <span class="mui-media-object mui-pull-left headImg" style="background: url('../../../img/contact/touxiang.png') no-repeat center center;background-size:cover;-webkit-background-size:cover;"></span>
                    <div class="mui-media-body">
                        林岚 <span class="woman"></span>
                        <p class="mui-ellipsis">闽江学院闽江学院闽江学院闽江学院闽江学院</p>
                    </div>
                    <span class="date">10:34</span>
                </a>
            </li>
        </ul>
    </div>
</div>
<!--有用到再引用-->
<!--接口-->
<script src="../../../js/mui.min.js"></script>
<script src="../../../js/base.js"></script>
<!--模板-->
<script src="../../../js/laytpl.js"></script>
<!--常用方法 dom操作用原生或mui-->
<script src="../../../js/mq.js"></script>
<script src="../../../js/Calender/Calender.js"></script>
<script src="sign.js"></script>
<script>
    mui.init();
    $$.initScroll();
    $$.fn.Calendar({
        el:".day",
        callback:function(date){
            console.log(date)
        },
        btnClick:function(){
            console.log(2)
        }
    });
</script>
</body>

</html>